// 员工的路由规则
// 把路由规则分成一个个文件 - 别人想要用，就要引入 - 这里就要导出

import Layout from '@/layout'

// 单一的路由规则用{}  所有的路由规则用[]
export default {
  // 路由规则
  path: '/employees', // 路由地址
  name: 'employees', // 给模块的一级路由加一个name属性 - 这个属性我们后面会在做权限的时候用到
  component: Layout, // 员工有自己的布局 - 常规思路这个界面是在主页的二级路由中，也就是主页路由的children中 - 但是员工是动态路由（会根据使用人不同而变化），主页路由为静态路由
  // 为什么用Layout 而没有直接用@/views/employees员工组件？ - 因为员工和主页(layout在主页)实际上是分开的，并不能把员工放到主页的children下面，一个是静态一个是动态
  children: [{
    // 二级路由的path什么都不写的时候 此时它表示二级路由的默认路由
    // 如果写了的话，在网址上仅输入/employees 只会出现布局，而不会出现二级路由页面，要想出现二级路由页面，就要在后面加上path中写的路径
    path: '', // 这里不用写 - 表示/employees不但有布局layout还有下面的/views/employees员工主页
    // 箭头函数的形式 - 动态引入，按需加载
    component: () => import('@/views/employees'),
    name: 'employees',
    // 路由元信息 - 其实就是一个存储数据的地方，可以放任何内容
    meta: {
      title: '员工管理', // 这里为什么要用title - 因为左侧导航读取了这里的title属性
      icon: 'people'
    }
  }, {
    path: 'detail/:id', // query传参 动态路由传参 - /employees/detail 是404  - 得加参数 - 想要写不写id都可以访问组件 - 在id后加?
    // path: 'detail/:id?', // ?的含义表示该参数可传可不传
    component: () => import('@/views/employees/detail'),
    hidden: true, // 不在左侧菜单显示 - 如果不加这个的话 那么两个子节点就冲突了 两个都不会在左侧菜单显示了
    meta: {
      title: '员工详情' // 标记当前路由规则的中文名称 后续在做左侧菜单时 使用
    }
  }, {
    path: 'print/:id', // 二级默认路由  id同来区分用来打印哪个员工的信息
    component: () => import('@/views/employees/print'), // 按需加载
    hidden: true,
    meta: {
      title: '员工打印', // 标记当前路由规则的中文名称 后续在做左侧菜单时 使用
      icon: 'people'
    }
  }]
}
